<template>
  <div class="page">
    <h4 style="margin-left: 3px">基本信息筛选</h4>
    <el-row :gutter="20">
      <el-form ref="formInline" :inline="true" :model="formInline" id="formbox">
        <el-col :span="8" class="mb20">
          <el-form-item label="姓名：" prop="name">
            <el-input
              clearable
              style="width: 252px"
              v-model="formInline.name"
              placeholder="请输入姓名"
            ></el-input>
          </el-form-item>
        </el-col>

        <el-col :span="8" class="mb20">
          <el-form-item label="证件号码：" prop="cardNumber">
            <el-input
              clearable
              style="width: 252px"
              v-model="formInline.cardNumber"
              @blur="getbirthday"
              placeholder="请输入证件号码"
            ></el-input>
          </el-form-item>
        </el-col>

        <el-col :span="8" class="mb20">
          <el-form-item label="不合格项：" prop="unacceptable">
            <el-select
              v-model="formInline.unacceptable"
              placeholder="请选择不合格项"
              multiple
              clearable
              @change="handleDiseaseTypeChange"
            >
              <el-option
                v-for="item in unqualifiedList"
                :label="item.label"
                :value="item.label"
                :key="item.label"
              >
              </el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="8" class="mb20">
          <el-form-item label="管理单位：" prop="managementUnit">
            <el-select
              v-model="formInline.managementUnit"
              placeholder="请选择管理单位"
              clearable
            >
              <el-option
                v-for="item in managementUnitList"
                :key="item"
                :label="item"
                :value="item"
              >
              </el-option>
              <!-- <el-option label="" value=""></el-option>
              <el-option label="" value=""></el-option>
              <el-option label="" value=""></el-option> -->
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="8" class="mb20">
          <el-form-item label="核查状态：" prop="verificationStatus">
            <el-select
              v-model="formInline.verificationStatus"
              placeholder="请选择核查状态"
              clearable
            >
              <el-option label="未核查" value="未核查"></el-option>
              <el-option label="已核查" value="已核查"></el-option>
              <el-option label="核查失败" value="核查失败"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="8" class="mb20">
          <el-form-item label="回填状态 :" prop="fillBackStatus">
            <el-select
              clearable
              v-model="formInline.fillBackStatus"
              placeholder="请选择回填状态"
            >
              <el-option label="回填成功" value="回填成功"></el-option>
              <el-option label="回填失败" value="回填失败"></el-option>
              <el-option label="未回填" value="未回填"></el-option>
            </el-select>
          </el-form-item>
        </el-col>
        <el-col :span="8" class="mb20">
          <el-form-item label="修改日期：" prop="medicalExaminationDate">
            <el-date-picker
              style="width: 232px"
              :disabled-date="disableFutureDates"
              v-model="formInline.medicalExaminationDate"
              type="daterange"
              value-format="YYYY-MM-DD"
              format="YYYY-MM-DD"
              range-separator="-"
              start-placeholder="开始时间"
              end-placeholder="结束时间"
              size="large"
            />
          </el-form-item>
        </el-col>
        <el-col :span="8" class="mb20">
          <el-form-item label="导入日期：" prop="nextMedicalExaminationDate">
            <el-date-picker
              style="width: 232px"
              :disabled-date="disableFutureDates"
              v-model="formInline.nextMedicalExaminationDate"
              type="daterange"
              value-format="YYYY-MM-DD"
              format="YYYY-MM-DD"
              range-separator="-"
              start-placeholder="开始时间"
              end-placeholder="结束时间"
              size="large"
            />
          </el-form-item>
        </el-col>
        <el-col :span="8" class="mb20">
          <el-form-item>
            <el-button type="primary" @click="onSubmit">查询</el-button>
            <el-button @click="onReset('formInline')">重置</el-button>
          </el-form-item>
        </el-col>
      </el-form>
    </el-row>
    <el-row class="popover-container">
      <el-popover
        placement="left"
        width="100"
        trigger="click"
        class=""
        @hide="isPopOpen = false"
      >
        <!-- v-model="isPopOpen" -->
        <div class="popover-item-list">
          <h3>任务进度</h3>
          <div class="item-titel gradient-text">信息核查:{{ checkProgress }}</div>
          <div class="item-titel gradient-text">并发数:{{ concurrency }}台</div>
          <div class="item-titel gradient-text">更新中:{{ backfillQuantity }}人</div>
        </div>

        <!-- <div class="arrow-container" slot="reference">
            <span class="arrow" :class="{ rotate: isPopOpen }">«</span>
          </div> -->
        <template #reference>
          <div class="arrow-container popover-content-list" slot="reference">
            <span
              class="arrow"
              :class="{ rotate: isPopOpen }"
              @click="isPopOpen = !isPopOpen"
              >«</span
            >
          </div>
        </template>
      </el-popover>
    </el-row>
    <div class="table-container">
      <el-col :span="24"
        ><h4 style="margin-left: 3px">档案列表 (共{{ total }}条)</h4></el-col
      >
      <el-col :span="24" style="display: flex">
        <el-col :span="3">
          <div class="table-btn">
            <div>
              <el-checkbox
                @change="checkedAllChange"
                v-model="checkedAll"
                :label="'全选'"
                :disabled="tableData.length == 0"
              />
            </div>
            <div style="margin-right: 10px">
              <label
                >已选择<el-text type="primary">{{
                  checkedAll == true ? selectionCount : multipleSelection.length
                }}</el-text
                >条</label
              >
            </div>
          </div>
        </el-col>
        <el-col :span="21" class="tr">
          <el-button
            type="primary"
            @click="showUpload"
            style="color: #fff; width: 110px"
            >导入</el-button
          >
          <el-button
            :disabled="multipleSelection.length === 0"
            @click="exportSelect()"
            type="primary"
            style="color: #fff; width: 110px"
            >导出</el-button
          >
          <el-button
            :disabled="multipleSelection.length === 0"
            @click="verification()"
            type="primary"
            style="color: #fff; width: 110px"
            >信息核查</el-button
          >
          <el-button
            :disabled="multipleSelection.length === 0"
            @click="updateArchives()"
            type="primary"
            style="color: #fff; width: 110px"
            >更新档案</el-button
          >

          <el-button
            :disabled="multipleSelection.length === 0"
            type="danger"
            @click="delSelect()"
            style="color: #fff; width: 110px"
            >删除</el-button
          >
          <el-button type="success" @click="downloadTemp()"
            >下载导入模版</el-button
          >
        </el-col>
      </el-col>
    </div>
    <el-table
      ref="multipleTableRef"
      border
      :data="tableData"
      style="width: 100%"
      table-layout="auto"
      max-height="460"
      class="tableAuto"
      @selection-change="handleSelectionChange"
    >
      <el-table-column type="selection" width="55"> </el-table-column>
      <el-table-column
        type="index"
        label="序号"
        width="80"
        align="center"
        fixed
      />
      <el-table-column prop="aiName" label="姓名" width="120" fixed="left">
      </el-table-column>
      <el-table-column
        prop="aiCardNumber"
        width="200"
        label="证件号码"
      >
      <template v-slot="scope">
          <span :class="scope.row.aiCardNumberStatus == 1 ? 'red' : ''">{{
            scope.row.aiCardNumber
          }}</span>
        </template>
      </el-table-column>
      <el-table-column
        prop="aiVerificationStatus"
        width="130"
        label="核查状态"
      >
    </el-table-column>
      <el-table-column
        prop="aiBackFillingStatus"
        width="130"
        label="回填状态"
      >
    </el-table-column>
      <el-table-column
        prop="aiNeighborhoodCommitteeName"
        width="180"
        label="村(居)委会名称"
        :show-overflow-tooltip="true"
      >
      <template v-slot="scope">
          <span :class="scope.row.aiNcnStatus == 1 ? 'red' : ''">{{
            scope.row.aiNeighborhoodCommitteeName
          }}</span>
        </template>
      </el-table-column>
      <el-table-column prop="aiPhoneNumber" width="150" label="联系电话">
      </el-table-column>
      <el-table-column
        prop="aiContacts"
        width="150"
        label="联系人姓名"
      >
      <template v-slot="scope">
          <span :class="scope.row.aiContactsStatus == 1 ? 'red' : ''">{{
            scope.row.aiContacts
          }}</span>
        </template>
    </el-table-column>
      <el-table-column prop="aiContactsNumber" width="150" label="联系人电话">

        <template v-slot="scope">
          <span :class="scope.row.aiContactsNumberStatus == 1 ? 'red' : ''">{{
            scope.row.aiContactsNumber
          }}</span>
        </template>
      </el-table-column>
      <el-table-column
        prop="aiAddress"
        width="240"
        :show-overflow-tooltip="true"
        label="现住址"
      >
      <template v-slot="scope">
          <span :class="scope.row.aiAddressStatus == 1 ? 'red' : ''">{{
            scope.row.aiAddress
          }}</span>
        </template>
      </el-table-column>
      <el-table-column
        prop="aiPaymentMethod"
        width="180"
        :show-overflow-tooltip="true"
        label="医疗费用支付方式"
      >
      <template v-slot="scope">
          <span :class="scope.row.aiPaymentMethodStatus == 1 ? 'red' : ''">{{
            scope.row.aiPaymentMethod
          }}</span>
        </template>
      </el-table-column>
      <el-table-column
        prop="aiCareer"
        width="180"
        :show-overflow-tooltip="true"
        label="职业"
      >
      <template v-slot="scope">
          <span :class="scope.row.aiCareerStatus == 1 ? 'red' : ''">{{
            scope.row.aiCareer
          }}</span>
        </template>
      </el-table-column>
      <el-table-column
        prop="aiWorkUnit"
        width="200"
        :show-overflow-tooltip="true"
        label="工作单位"
      >
      <template v-slot="scope">
          <span :class="scope.row.aiWorkUnitStatus == 1 ? 'red' : ''">{{
            scope.row.aiWorkUnit
          }}</span>
        </template>
      </el-table-column>
      <el-table-column prop="aiBloodType" label="血型">
        <template v-slot="scope">
          <span :class="scope.row.aiBloodTypeStatus == 1 ? 'red' : ''">{{
            scope.row.aiBloodType
          }}</span>
        </template>
      </el-table-column>
      <el-table-column prop="aiRhType" label="RH">
        <template v-slot="scope">
          <span :class="scope.row.aiRhTypeStatus == 1 ? 'red' : ''">{{
            scope.row.aiRhType
          }}</span>
        </template>
      </el-table-column>
      <el-table-column prop="aiEducationDegree" width="150" label="文化程度" :show-overflow-tooltip="true">
        <template v-slot="scope">
          <span :class="scope.row.aiEDEStatus == 1 ? 'red' : ''">{{
            scope.row.aiEducationDegree
          }}</span>
        </template>
      </el-table-column>
      <el-table-column
        prop="aiMaritalStatus"
        label="婚姻状况"
        width="150"
        :show-overflow-tooltip="true"
      >
      <template v-slot="scope">
          <span :class="scope.row.aiMaritalStatusStatus == 1 ? 'red' : ''">{{
            scope.row.aiMaritalStatus
          }}</span>
        </template>
      </el-table-column>
      <el-table-column
        prop="aiPermanentResidencyType"
        width="120"
        :show-overflow-tooltip="true"
        label="常住类型"
      >
      <template v-slot="scope">
          <span :class="scope.row.aiPRTStatus == 1 ? 'red' : ''">{{
            scope.row.aiPermanentResidencyType
          }}</span>
        </template>
      </el-table-column>
      <el-table-column
        prop="aiHouseholdRegistrationType"
        width="120"
        :show-overflow-tooltip="true"
        label="户口类型"
      >
      </el-table-column>
      <!-- <el-table-column
            prop="villageCommittee"
            width="180"
            :show-overflow-tooltip="true"
            label="村委会">
          </el-table-column>
          -->
      <el-table-column
        prop="aiDomicileAddress"
        width="240"
        :show-overflow-tooltip="true"
        label="户籍地址"
      >
        <template v-slot="scope">
          <span :class="scope.row.aiDomicileAddressStatus == 1 ? 'red' : ''">{{
            scope.row.aiDomicileAddress
          }}</span>
        </template>
      </el-table-column>
      <el-table-column
        prop="aiDomicileType"
        width="120"
        :show-overflow-tooltip="true"
        label="户籍类型"
      >
      <template v-slot="scope">
          <span :class="scope.row.aiDomicileTypeStatus == 1 ? 'red' : ''">{{
            scope.row.aiDomicileType
          }}</span>
        </template>
      </el-table-column>
      <el-table-column
        prop="aiManagementInstitution"
        width="200"
        :show-overflow-tooltip="true"
        label="管理单位"
      >
      </el-table-column>
      <el-table-column
        prop="unacceptable"
        width="150"
        :show-overflow-tooltip="true"
        label="不合格项"
      >
      </el-table-column>
      <el-table-column
        prop="aiUpdateDate"
        width="150"
        :show-overflow-tooltip="true"
        label="修改日期"
      >
      </el-table-column>
      <el-table-column
        prop="aiInputPerson"
        :show-overflow-tooltip="true"
        label="导入人"
        width="150"
      >
      </el-table-column>
      <el-table-column
        prop="aiImportTime"
        :show-overflow-tooltip="true"
        label="导入日期"
        width="150"
      >
      </el-table-column>
      <el-table-column fixed="right" label="操作" width="150">
        <template #default="scope">
          <el-button
            text=""
            size="small"
            type="primary"
            @click.native.prevent="showRow(scope.$index)"
          >
            查看
          </el-button>
          <el-button
            text=""
            size="small"
            type="danger"
            @click.native.prevent="deleteRow(scope.row)"
          >
            删除
          </el-button>
        </template>
      </el-table-column>
    </el-table>
    <el-col
      :span="24"
      style="
        display: flex;
        justify-content: end;
        margin-bottom: 50px;
        margin-top: 30px;
      "
    >
      <el-pagination
        v-if="this.total > 0"
        v-model:currentPage="this.currentPage"
        v-model:page-size="this.size"
        :total="this.total"
        :page-sizes="[10, 20, 50, 100, 500]"
        class="new-pagination"
        small
        background
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        layout="total, sizes, prev, pager, next, jumper"
      />
    </el-col>
    <el-dialog title="查看" width="80%" v-model="dialogDescVisible">
      <el-descriptions title="" direction="vertical" :column="4" border>
        <el-descriptions-item label="姓名" show-overflow-tooltip>{{
          people?.aiName
        }}</el-descriptions-item>
        <el-descriptions-item label="性别" show-overflow-tooltip>{{
          people?.aiGender
        }}</el-descriptions-item>
        <el-descriptions-item label="联系方式" show-overflow-tooltip>{{
          people?.aiPhoneNumber
        }}</el-descriptions-item>
        <el-descriptions-item label="证件号码" show-overflow-tooltip>{{
          people?.aiCardNumber
        }}</el-descriptions-item>
        <el-descriptions-item label="证件类型" show-overflow-tooltip>{{
          people?.aiCardType
        }}</el-descriptions-item>
        <el-descriptions-item label="出生日期" show-overflow-tooltip>{{
          people?.aiBirthday
        }}</el-descriptions-item>
        <el-descriptions-item label="联系人姓名" show-overflow-tooltip>{{
          people?.aiContacts
        }}</el-descriptions-item>
        <el-descriptions-item label="联系人电话" show-overflow-tooltip>{{
          people?.aiContactsNumber
        }}</el-descriptions-item>
        <el-descriptions-item label="国籍" show-overflow-tooltip>{{
          people?.aiNationality
        }}</el-descriptions-item>
        <el-descriptions-item label="民族" show-overflow-tooltip>{{
          people?.aiNation
        }}</el-descriptions-item>
        <el-descriptions-item label="血型" show-overflow-tooltip>{{
          people?.aiBloodType
        }}</el-descriptions-item>
        <el-descriptions-item label="rh类型" show-overflow-tooltip>{{
          people?.aiRhType
        }}</el-descriptions-item>
        <el-descriptions-item label="文化程度" show-overflow-tooltip>{{
          people?.aiEducationDegree
        }}</el-descriptions-item>
        <el-descriptions-item label="职业" show-overflow-tooltip>{{
          people?.aiCareer
        }}</el-descriptions-item>
        <el-descriptions-item label="工作单位" show-overflow-tooltip>{{
          people?.aiWorkUnit
        }}</el-descriptions-item>
        <el-descriptions-item label="婚姻状况" show-overflow-tooltip>{{
          people?.aiMaritalStatus
        }}</el-descriptions-item>
        <el-descriptions-item label="支付方式" show-overflow-tooltip>{{
          people?.aiPaymentMethod
        }}</el-descriptions-item>
        <el-descriptions-item label="常住类型" show-overflow-tooltip>{{
          people?.aiPermanentResidencyType
        }}</el-descriptions-item>
        <el-descriptions-item label="现住址" show-overflow-tooltip>{{
          people?.aiAddress
        }}</el-descriptions-item>
        <el-descriptions-item label="所在居委会" show-overflow-tooltip>{{
          people?.aiNeighborhoodCommitteeName
        }}</el-descriptions-item>
        <el-descriptions-item label="户籍类型" show-overflow-tooltip>{{
          people?.aiDomicileType
        }}</el-descriptions-item>
        <el-descriptions-item label="户籍地址" show-overflow-tooltip>{{
          people?.aiDomicileAddress
        }}</el-descriptions-item>
        <el-descriptions-item label="户口类型" show-overflow-tooltip>{{
          people?.aiHouseholdRegistrationType
        }}</el-descriptions-item>
        <el-descriptions-item label="药物过敏史" show-overflow-tooltip>{{
          people?.aiDrugAllergiesHistory
        }}</el-descriptions-item>
        <el-descriptions-item label="暴露史" show-overflow-tooltip>{{
          people?.aiExposureHistory
        }}</el-descriptions-item>
        <el-descriptions-item label="既往疾病史" show-overflow-tooltip>{{
          people?.aiPastMedicalHistory
        }}</el-descriptions-item>
        <el-descriptions-item label="近一年就诊记录" show-overflow-tooltip>
          <span class="text-ellipsis">{{
            people?.aiLastYearMedicalRecords
          }}</span>
        </el-descriptions-item>
        <el-descriptions-item label="纳入高血压日期" show-overflow-tooltip>{{
          people?.aiHypertensionTime
        }}</el-descriptions-item>
        <el-descriptions-item label="糖尿病" show-overflow-tooltip>{{
          people?.aiDiabetes
        }}</el-descriptions-item>
        <el-descriptions-item label="纳入糖尿病日期" show-overflow-tooltip>{{
          people?.aiDiabetesTime
        }}</el-descriptions-item>
        <el-descriptions-item label="既往手术史" show-overflow-tooltip>{{
          people?.aiPreviousSurgicalHistory
        }}</el-descriptions-item>
        <el-descriptions-item label="既往外伤历史" show-overflow-tooltip>{{
          people?.aiPreviousTraumaHistory
        }}</el-descriptions-item>
        <el-descriptions-item label="既往输血" show-overflow-tooltip>{{
          people?.aiPreviousTransfusionHistory
        }}</el-descriptions-item>
        <el-descriptions-item label="父亲疾病" show-overflow-tooltip>{{
          people?.aiFatherMedicalHistory
        }}</el-descriptions-item>
        <el-descriptions-item label="母亲疾病" show-overflow-tooltip>{{
          people?.aiMotherMedicalHistory
        }}</el-descriptions-item>
        <el-descriptions-item label="兄弟姐妹疾病" show-overflow-tooltip>{{
          people?.aiBrotherSisterMedicalHistory
        }}</el-descriptions-item>
        <el-descriptions-item label="子女疾病" show-overflow-tooltip>{{
          people?.aiChildrenMedicalHistory
        }}</el-descriptions-item>
        <el-descriptions-item label="遗传病史" show-overflow-tooltip>{{
          people?.aiGeneticHistory
        }}</el-descriptions-item>
        <el-descriptions-item label="残疾情况" show-overflow-tooltip>{{
          people?.aiDisabilitySituation
        }}</el-descriptions-item>
        <el-descriptions-item label="最近一次门诊日期" show-overflow-tooltip>{{
          people?.aiLastOutpatientTime
        }}</el-descriptions-item>
        <el-descriptions-item label="最近一次门诊医生" show-overflow-tooltip>{{
          people?.aiLastOutpatientDoctor
        }}</el-descriptions-item>
        <el-descriptions-item label="最近一次门诊机构" show-overflow-tooltip>{{
          people?.aiLastOutpatientInstitution
        }}</el-descriptions-item>
        <el-descriptions-item label="最近一次门诊挂号" show-overflow-tooltip>{{
          people?.aiLastRegistrationPersonnel
        }}</el-descriptions-item>
        <el-descriptions-item label="备注" show-overflow-tooltip>{{
          people?.aiRemark
        }}</el-descriptions-item>
        <el-descriptions-item label="建档单位" show-overflow-tooltip>{{
          people?.aiEstablishArchivesInstitution
        }}</el-descriptions-item>
        <el-descriptions-item label="建档人" show-overflow-tooltip>{{
          people?.aiEstablishArchivesPerson
        }}</el-descriptions-item>
        <el-descriptions-item label="建档日期" show-overflow-tooltip>{{
          people?.aiEstablishArchivesTime
        }}</el-descriptions-item>
        <el-descriptions-item label="管理单位" show-overflow-tooltip>{{
          people?.aiManagementInstitution
        }}</el-descriptions-item>
        <!-- <el-descriptions-item label="家庭医生" show-overflow-tooltip>{{
          people?.responsibleDoctor
        }}</el-descriptions-item> -->
        <el-descriptions-item label="责任医生" show-overflow-tooltip>{{
          people?.aiResponsibleDoctor
        }}</el-descriptions-item>
        <el-descriptions-item label="修改日期" show-overflow-tooltip>{{
          people?.aiUpdateDate
        }}</el-descriptions-item>
        <el-descriptions-item label="修改医生" show-overflow-tooltip>{{
          people?.aiUpStringDoctor
        }}</el-descriptions-item>
        <el-descriptions-item
          label=""
          show-overflow-tooltip
        ></el-descriptions-item>
        <el-descriptions-item
          :rowspan="1"
          label="不合格项"
          show-overflow-tooltip
          >{{ people?.unacceptable }}</el-descriptions-item
        >
      </el-descriptions>
    </el-dialog>

    <DrugDialog
      ref="drugDialogRef"
      :state="state"
      @changeDrug="handleChangeDD"
    ></DrugDialog>
  </div>
</template>

<script lang="ts">
import http from "@/utils/request";
import { ElMessage } from "element-plus";
import { getToken } from "@/utils/common";
const disableFutureDates = (time) => time > new Date();
import DrugDialog from "@/pages/examples/archive/components/drugDialog.vue";

export default {
  components: {
    DrugDialog,
  },
  name: "LibraryPage",
  data() {
    return {
      isPopOpen: false,
      checkProgress:"",
      concurrency:0,
      backfillQuantity:0,
      pickerOptions: {
        disabledDate(time) {
          return time.getTime() > Date.now() - 8.64e6;
        },
      },
      state: {
        dialogUploadVisible: false,
        accept: ".xlsx,.csv",
      },
      url: "/api/v1.0" + "/archive/importArchive",
      dialogDescVisible: false,
      dialogUploadVisible: false,
      loading: null,
      multipleSelection: [],
      //不合格项数组
      unqualifiedList: [
        { label: "村(居)委会名称" },
        { label: "联系电话" },
        { label: "现地址" },
        { label: "联系人姓名" },
        { label: "联系人电话" },
        { label: "血型" },
        { label: "RH类型" },
        { label: "文化程度" },
        { label: "职业" },
        { label: "工作单位" },
        { label: "婚姻状况" },
        { label: "支付方式" },
        { label: "常住类型" },
        { label: "户籍类型" },
        { label: "户籍地址" },
        { label: "户口类型" },
        { label: "药物过敏史" },
      ],
      //管理单位
      managementUnitList: [],
      formInline: {
        name: "",
        // gender: "",
        birthday: "",
        responsibleDoctor: "",
        managementUnit: "",
        verificationStatus: "",
        nextFollowTime: "",
        followTime: "",
        cardNumber: "",
        unacceptable: [],
        followBeginTime: "",
        followEndTime: "",
        nextFollowBeginTime: "",
        nextFollowEndTime: "",
        modificationBeginDate: "",
        modificationEndDate: "",
        nextCheckUpBeginTime: "",
        nextCheckUpEndTime: "",
        medicalExaminationDate: "",
        nextMedicalExaminationDate: "",
        fillBackStatus: "",
      },
      people: null,
      // tableData: [],
      tableData: [],
      currentPage: 1,
      size: 10,
      fileList: [],
      total: 0,
      //选择条数
      selectionCount: 0,
      //全选状态
      checkedAll: false,
    };
  },
  mounted() {
    this.getLibrary();
    this.getManagementUnit();
    this.searchQuest();
    //@ts-ignore
    document.querySelector('.routerView').style.paddingTop='0px';
  },
  beforeUnmount() {
    //@ts-ignore
    document.querySelector('.routerView').style.paddingTop='50px';
  },
  methods: {
    disableFutureDates,
    handleChangeDD(newValue, oldValue) {
      this.state.dialogUploadVisible = newValue;
      this.getLibrary();
    },
    handleDiseaseTypeChange() {
      // 如果选择的项超过五个，移除最后一个选择
      if (this.formInline.unacceptable.length > 5) {
        this.formInline.unacceptable.pop();
        this.$message.warning("最多只可选择五个不合格项");
      }
    },
    //全选
    checkedAllChange() {
      if (this.checkedAll == true) {
        this.selectionCount = this.tableData.length;
        console.log(this.tableData);
        this.tableData.forEach((row: any) => {
          this.$refs.multipleTableRef!.toggleRowSelection(row, true);
        });
      } else {
        this.selectionCount = 0;
        this.$refs.multipleTableRef!.clearSelection();
      }
    },
    getLibrary() {
      // 准备请求数据，从表单数据中过滤出非空字段，并加入size和page信息
      const requestData = {};
      for (const key in this.formInline) {
        if (this.formInline[key]) {
          requestData[key] = this.formInline[key];
          if (key == "followTime") {
            //@ts-ignore
            requestData.followBeginTime = this.formInline.followTime[0];
            //@ts-ignore
            requestData.followEndTime = this.formInline.followTime[1];
          }
          if (key == "nextFollowTime") {
            //@ts-ignore
            requestData.nextFollowBeginTime = this.formInline.nextFollowTime[0];
            //@ts-ignore
            requestData.nextFollowEndTime = this.formInline.nextFollowTime[1];
          }
          if (key == "medicalExaminationDate") {
            //@ts-ignore
            requestData.modificationBeginDate =
              this.formInline.medicalExaminationDate[0];
            //@ts-ignore
            requestData.modificationEndDate =
              this.formInline.medicalExaminationDate[1];
          }
          if (key == "nextMedicalExaminationDate") {
            //@ts-ignore
            requestData.importBeginTime =
              this.formInline.nextMedicalExaminationDate[0];
            //@ts-ignore
            requestData.importEndTime =
              this.formInline.nextMedicalExaminationDate[1];
          }
          if (key == "unacceptable") {
            //@ts-ignore
            requestData.unacceptable.length == 0
            //@ts-ignore
              ? delete requestData.unacceptable
              : "";
          }
        }
      }
      //@ts-ignore
      delete requestData.nextMedicalExaminationDate;
      //@ts-ignore
      delete requestData.medicalExaminationDate;
      //@ts-ignore
      delete requestData.followTime;
      //@ts-ignore
      requestData.size = this.size;
      //@ts-ignore
      requestData.page = this.currentPage;

      // 发送POST请求，请求档案信息
      http.post("/archive/getPageList", requestData).then((res) => {
        // 更新表格数据和总数
        //@ts-ignore
        if (res.code == 200) {
          this.tableData = res.data.list;
          this.total = res.data.total;
        }
      });
    },
    //获取管理单位
    getManagementUnit() {
      http.get("/archive/getManagementUnit").then((res) => {
        //@ts-ignore
        if (res.code == 200) {
          this.managementUnitList = res.data;
        }
      });
    },
    //获取出生日期
    getbirthday() {
      if (
        this.formInline.cardNumber &&
        this.formInline.cardNumber.length === 18
      ) {
        const birthday = this.formInline.cardNumber.substring(6, 14);
        this.formInline.birthday =
          birthday.substring(0, 4) +
          "-" +
          birthday.substring(4, 6) +
          "-" +
          birthday.substring(6, 8);
      }
    },
    exportSelect() {
      const upArr = [];
      this.multipleSelection.forEach((v) => {
        upArr.push(v.id);
      });
   
      http.post("/archive/exportToExcel", upArr).then((res) => {
        //@ts-ignore
        if ((res.code = 200)) {
          //@ts-ignore
          ElMessage.success(res.message);
          this.multipleSelection = [];
          this.checkedAll = false;
          this.$refs.multipleTableRef.clearSelection();
          window.open(res.data);
        }
      });
    },
    //信息核查
    verification(){
      const upArr = [];
      this.multipleSelection.forEach((v) => {
        upArr.push(v.id);
      });
      const Arrtrue= this.multipleSelection.some((v) => {
        return v.aiVerificationStatus == '未核查';
      });
      console.log(Arrtrue);
      
      if(Arrtrue){
        http.post("/archive/manualVerification", upArr).then((res) => {
        //@ts-ignore
        if ((res.code = 200&&res.message!=='核查失败,选择的数据中有核查过的数据')) {
          //@ts-ignore
          ElMessage.success(res.message);
          this.multipleSelection = [];
          this.checkedAll = false;
          this.$refs.multipleTableRef.clearSelection();
        }
      });
      }else{
        ElMessage.error("已核查无需重复提交");
      }
    },
    //更新档案
    updateArchives(){
      const upArr = [];
      this.multipleSelection.forEach((v) => {
        upArr.push(v.id);
      });
      const Arrtrue= this.multipleSelection.every((v) => {
        return v.aiVerificationStatus !== '未核查';
      });
     
      if(Arrtrue){
        http.post("/archive/manualBackFilling", upArr).then((res) => {
        //@ts-ignore
        if ((res.code = 200&&res.message=='提交成功')) {
          //@ts-ignore
          ElMessage.success(res.message);
          this.multipleSelection = [];
          this.checkedAll = false;
          this.$refs.multipleTableRef.clearSelection();
        }
      });
      }else{
        ElMessage.error("存在未核查数据，不可操作");
      }
      
     
      
    },
    downloadTemp() {
      http.post("/archive/initializeExcelTemplate").then((res) => {
        //@ts-ignore
        if (res.code === 200) {
          window.open(res.data);
        }
      });
    },
    delSelect() {
      const delArr = [];
      this.multipleSelection.forEach((v) => {
        delArr.push(v.id);
      });
      this.$confirm("是否确认删除已选择数据", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          http.post("/archive/deleteList", delArr).then((res) => {
            //@ts-ignore
            if (res.code === 200) {
              //@ts-ignore
              ElMessage.success(res.message);
              this.multipleSelection = [];
              this.$refs.multipleTableRef!.clearSelection();
              this.getLibrary();
            }
          });
        })
        .catch(() => {
          //
        });
    },
    deleteRow(row) {
      this.$confirm("是否确认删除已选择数据", "提示", {
        confirmButtonText: "确定",
        cancelButtonText: "取消",
        type: "warning",
      })
        .then(() => {
          http.post("/archive/deleteList", [row.id]).then((res) => {
            //@ts-ignore
            if (res.code === 200) {
              //@ts-ignore
              ElMessage.success(res.message);
              this.multipleSelection = [];
              this.$refs.multipleTableRef!.clearSelection();
              this.getLibrary();
            }
          });
        })
        .catch(() => {
          //
        });
    },
    onBack() {
      window.location.href = "/";
    },
    onSubmit() {
      this.currentPage = 1;
      this.getLibrary();
    },
    onReset(formName) {
      this.$refs[formName].resetFields();
      this.currentPage = 1;
    },
    handleSelectionChange(val) {
      this.multipleSelection = val;
      if (val.length == this.total || val.length == this.size) {
        this.checkedAll = true;
        this.selectionCount = val.length;
      } else {
        this.checkedAll = false;
        this.selectionCount = 0;
      }
    },
    showRow(index) {
      console.log(index, "执行了");
      this.people = this.tableData[index];
      this.dialogDescVisible = true;
    },
    handleSizeChange(val) {
      this.size = val;
      this.getLibrary();
    },
    handleCurrentChange(val) {
      this.currentPage = val;
      this.getLibrary();
    },
    showUpload() {
      this.state.dialogUploadVisible = true;
    },
    //文件格式 大小
    beforeUpload(file) {
      const isValidType =
        file.type ===
          "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet" ||
        file.type === "text/csv";
      const isValidSize = file.size / 1024 / 1024 < 100;

      if (!isValidType) {
        ElMessage.error("只能上传 XLSX 或 CSV 格式的文件!");
        return;
      }
      if (!isValidSize) {
        ElMessage.error("文件大小不能超过 100MB!");
        return;
      }
      return isValidType && isValidSize;
    },
    submitUpload() {
      if (this.fileList.length > 0) {
        this.$refs.upload.submit();
      } else {
        ElMessage.error("请选择文件");
      }
    },

    uploadSuccess(response) {
      const data = response;
      if (data.code == 200) {
        ElMessage.success(data.message);
      } else {
        ElMessage.error(data.message);
      }
      this.fileList = [];
      this.dialogUploadVisible = false;
      this.$refs.upload.clearFiles(); // 清空 el-upload 的内部文件列表
      // ElMessage.success("导入成功");
      if (data.code === 200) {
        ElMessage.success(data.msg);
        this.dialogUploadVisible = false;
        this.getLibrary();
      } else {
        this.dialogUploadVisible = false;
      }
    },
    handleError(response) {
      console.log(response);
      const data = response;
      this.fileList = [];
      this.$refs.upload.clearFiles(); // 清空 el-upload 的内部文件列表
      this.dialogUploadVisible = false;
    },
    handleRemove(file, fileList) {
      // console.log(file, fileList);
      this.fileList = fileList;
    },
    handlePreview(file, fileList) {
      // console.log(file);
    },
    handleChange(file, fileList) {
      this.fileList = fileList; // 更新文件列表
    },
    searchQuest(){
      http.get("/archive/taskProgress").then((res) => {
        if (res.code == 200) {
          this.concurrency = res.data.concurrency;
          this.checkProgress = res.data.checkProgress;
          this.backfillQuantity = res.data.backfillQuantity;
        }
      })
    }
  },
  computed: {
    uploadHeaders() {
      // 返回包含 token 的请求头
      const token = getToken();
      return {
        token: `${token}`,
      };
    },
  },
  watch: {
    isPopOpen: {
      handler: function () {
        if (this.isPopOpen) {
          this.searchQuest();
        }
      },
    }
  }
};
</script>
<style scoped>
body {
  margin: 0;
  padding: 0;
  background: #fff;
}
:deep(.el-input__wrapper) {
  width: 274px;
}
:deep(.el-form-item .el-select__wrapper) {
  min-height: 32px;
  width: 252px;
  /* min-width: 252px; */
}
:deep(.el-range-editor--large.el-input__wrapper) {
  height: 32px;
  width: 232px;
}
#formbox {
  display: flex;
  flex-wrap: wrap;
  padding: 0 30px;
}
.table-btn {
  display: flex;
  height: 50px;
  align-items: center;
  justify-content: space-around;
}
.red {
  color: #f82c08;
}
.text-ellipsis {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display: inline-block;
  max-width: 300px; /* 设置最大宽度限制 */
  vertical-align: top;
}
.el-header {
  background: #4485dd;
  color: #fff;
}
h1 {
  font-size: 14px;
  text-align: left;
  padding: 0;
}
h2 {
  font-size: 18px;
}
h3 {
  margin: 0;
}
.el-main {
  padding: 0;
  height: calc(100vh - 74px);
}
.main-filter {
  padding: 0 20px;
  border-bottom: 1px solid #f1f1f1;
}
.op {
  padding: 20px;
}
.op h4 {
  margin: 0;
  padding: 0;
}
.tr {
  text-align: right;
}
.tb {
  padding: 0 20px;
  margin-top: 2vw;
}
.tableAuto.el-table .cell {
  white-space: nowrap;
}
.el-descriptions-item__label.is-bordered-label {
  width: 25%;
}
.el-form-item {
  margin-bottom: 15px;
  margin-right: 5vw !important;
}
:deep(.routerView) {
  padding-top: 0 !important;
}
.popover-container {
  display: flex;
  justify-content: end;
  position: relative;
}
.arrow-container {
  display: flex;
  align-items: center;
  cursor: pointer;
}

.arrow {
  font-size: 23px;
  color: #409eff;
  margin-right: 8px;
  transition: transform 0.3s;
}

.rotate {
  transform: rotate(180deg); /* 点击后箭头旋转 */
}
.arrow-container:hover .arrow {
  color: #ff9f43; /* 悬停时箭头颜色变为橙色 */
}
.popover-item-list {
  border-radius: 10px;
  padding: 10px;
}
.popover-content-list {
  padding: 5px;
  background-color: rgba(255, 255, 255, 0.2); /* 背景透明 */
  border: 2px solid #409eff; /* 默认边框颜色 */
  border-radius: 10px;
  transition: border-color 0.3s ease; /* 边框颜色变化动画 */
}
.popover-content-list:hover {
  border-color: #ff9f43; /* 悬停时边框颜色变为橙色 */
}
.gradient-text {
  background: linear-gradient(45deg, #409eff, #ff9f43);
  -webkit-background-clip: text;
  color: transparent;
  font-weight: bold;
  transition: background 0.5s ease;
}
popover-item {
  width: 100%;
  box-sizing: border-box;
  overflow-y: auto;
  overflow-x: hidden;
  height: 300px;
}
.popover-item-list {
  width: 100%;
  /* height: 250px; */
  box-sizing: border-box;
  padding: 10px;
}
.item-titel {
  margin-top: 10px;
  font-weight: 600;
  font-size: 14px;
}
.popover-footer {
  width: 100%;
  display: flex;
  justify-content: space-between;
  margin-top: 10px;
}
</style>
